<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>dom操作</title>
    <script type="text/javascript" src="jquery-1.8.0.js"></script>
    <script type="text/javascript">
        $(function () {
            //1.获得元素节点的并打印出它的文本内容
            //获取ul里的第二个li节点
            var $li = $("ul li:eq(1)");
            var litxt = $li.text();
            alert(litxt);

            //查找属性节点
            var $para = $("p");
            var ptxt = $para.attr("title");//获得p标签的title属性
            alert(ptxt);

            //创建元素节点和文本节点，属性节点
            var $li1 = $("<li>香蕉</li>");//创建一个li元素节点  包括元素节点名和文
            var $li2 = $("<li>雪梨</li>");
            var $li3 = $("<li title='葡萄'>葡萄</li>");

            //追加到ul节点去
            //$("ul").append($li1);
            //$("ul").append($li2);

            //链式编程
            $("ul").append($li1).append($li2).append($li3);

        })

    </script>
</head>

<body>
<p title="选择您喜欢的水果">选择您喜欢的水果？</p>
<ul>
    <li title="苹果">苹果</li>
    <li title="芒果">芒果</li>
    <li title="桔子">桔子</li>
    <li title="楷杷">楷杷</li>
    <li title="菠萝">菠萝</li>
</ul>
</body>
</html>
